<template>
  <view class="page">
    <!-- 自定义头部 start -->
    <fu-custom bgColor="bg-white" :isBack="false"><block slot="content">{{i18n['授权登录']}}</block></fu-custom>
    <!-- 自定义头部 -->
    <view>
      <view class="header"><image :src="$IMGBASEURL+'/logo.png'"></image></view>
      <view class="content margin-top">
        <view>{{i18n['申请获取以下权限']}}</view>
        <text>{{i18n['获得你的手机号码信息']}}</text>
      </view>
      <button class="bottom bg-green"  type="primary" open-type="getPhoneNumber" withCredentials="true" lang="zh_CN" @getphonenumber="getPhoneNumber" style="background:#39b54a;">
       {{ i18n['绑定手机号']}}
      </button>
    </view>
  </view>
</template>

<script>
import { SYSTEM_CONFIG } from '@/common/config.js';
export default {
  data() {
    return {
	  avatarUrl:'',
      code: '',
	  $IMGBASEURL:this.$IMGBASEURL
    };
  },
  methods: {
	// 选择头像
	onChooseAvatar(){
		
	},
    // 取消登录
    cancle() {
      uni.navigateBack();
    },
    // 获取手机号
    getPhoneNumber(e) {
		console.log(e)
      // 用户取消授权,返回上一页
      // 用户同意授权,调用登录方法
      if (e.detail.errMsg.indexOf('user deny') !== -1) {
        uni.navigateBack();
      } else {
        this.bindMoblile(e.detail.code);
      }
    },
    // 绑定手机号
    bindMoblile(code) {
      uni.showLoading({
        title: this.i18n['绑定中...']
      });
	  let wxinfo = {
		  openid:uni.getStorageSync('Wxinfo_tmp').openId||'',
		  unionid:uni.getStorageSync('Wxinfo_tmp').unionid||'',
		  nickName:uni.getStorageSync('Wxinfo_tmp').nickName||'',
		  avatarUrl:uni.getStorageSync('Wxinfo_tmp').avatarUrl || '',
	  };
      // 获取用户授权信息
      uni.login({
        success: res => {
          /* 用户信息发给后台 */
          this.$api
            .post(global.apiUrls.postMiniparamMobile, {
              code: code,
			  wxinfo:JSON.stringify(wxinfo),
			  invite_code:uni.getStorageSync('invite_code') || ''
            })
            .then(res => {
              res = res.data;
              uni.hideLoading();
              if (res.code == 1) {
                uni.removeStorageSync('Wxinfo_tmp');
                uni.removeStorageSync('invite_code');
                // 保存用户信息到 store 中
                this.$store.commit('updateUserInfo', res.data.userinfo);
				uni.navigateBack();  
              } else {
                this.$message.info(res.msg);
              }
            })
            .catch(err => {
              uni.hideLoading();
              console.log('ERROR', err);
            });
        }
      });
    }
  }
};
</script>

<style lang="scss" scoped>
.page {
  min-height: 100vh;
  background: #fff;
}
.avatar-wrapper{
	width: 100rpx;
	height: 100rpx;
	margin: 40rpx auto;
}
.weui-input{
	margin: 0 80rpx;
	padding: 40rpx 20rpx;
	background: #f5f5f5;
	border-radius: 12rpx;
	font-size: 20rpx;
}
.header {
  height: 400rpx;
  display: flex;
  justify-content: center;
  align-items: center;
  image {
    width: 200rpx;
    height: 200rpx;
	box-shadow: 3px 3px 6px 4px #CCCCCC;
	border-radius: 16rpx;
  }
}

.content {
  margin-left: 50rpx;
  margin-bottom: 90rpx;
}

.content text {
  display: block;
  color: #9d9d9d;
  margin-top: 40rpx;
}

.bottom {
  border-radius: 80rpx;
  margin: 70rpx 50rpx;
  font-size: 35rpx;
}
</style>
